require(['config'], () => {
  require(['jquery', 'artTemplate', 'cookie'], ($, template) => {
    class ShoppingPage {
      constructor() {
        this.cart = []
        $.cookie.json = true
        this.loadCart()
        this.shoppingEventListener()
        this.bindEventListener()
      }

      loadCart () {
        this.cart = $.cookie('cart') || []
      }
      shoppingEventListener () {
        const html = template('shopping-template', { cart: this.cart })
        $.cookie('cart', this.cart, { expires: 10 })
        $('.jingr tbody').html(html)
        const total = this.cart.reduce((result, item) => {
          if (item.checked) {
            result += item.price * item.amount
          }
          return result
        }, 0)
        $('.money').html(total)
      }
      removeFromCart (e) {
        const id = $(e.target).parents('.item').data('id')

        this.cart = this.cart.filter(item => item.id !== id)
        this.shoppingEventListener()
        $.cookie('cart', this.cart, { expires: 10 })
        console.log($.cookie('cart'));
        console.log(this.cart);
      }

      modifyAmount (e) {
        // const src = $(e.target)
        // const parent = src.parents(".item")
        // const price = parent.find(".price").html()
        // let amount = Number(src.siblings('.amount').val())
        // if (src.is('.dels')) {
        //   if (amount <= 1) {
        //     return
        //   }
        //   amount -= 1
        // } else {
        //   amount += 1
        // }
        // src.siblings('.amount').val(amount)
        // parent.find('.amn').html((price * 10) * amount / 10)
        const src = $(e.target)
        const id = src.parents('.item').data('id')
        this.cart.forEach(item => {
          if (item.id === id) {
            if (src.is('.add')) {
              item.amount += 1
            } else if (src.is('.dels')) {
              if (item.amount <= 1) {
                return
              }
              item.amount -= 1
            } else if (src.is('.amount')) {
              const _amount = src.val()
              if (!/^\+?[1-9][0-9]*$/.test(_amount)) {
                console.log("格式有误");
              } else {
                item.amount = Number(_amount)
              }
            }
          }
        })
        this.shoppingEventListener()
      }

      allEventListener (e) {
        const _check = $(e.target).prop('checked')
        this.cart.forEach(item => {
          item.checked = _check
        })
        this.shoppingEventListener()
      }
      notAllEventlistener (e) {
        if (this.cart.length == $('.ck:checked').length) {
          console.log('你不讲道理');
          $('.all_check').prop('checked', "checked")
          console.log($('.all_check').prop('checked'))
        } else if (this.cart.length !== $('.ck:checked').length) {
          $('.all_check').prop('checked', "")
        }
        const id = $(e.target).parents('.item').data('id')
        this.cart.forEach(item => {
          if (item.id === id) {
            item.checked = $(e.target).prop('checked')
          }
        })
        this.shoppingEventListener()
      }
      removeCheck () {
        console.log('11')
        $('.ck:checked').each((index, dom) => {
          const id = $(dom).parents('.item').data('id')

          console.log(id);
          this.cart = this.cart.filter(item => item.id !== id)
        })
        this.shoppingEventListener()

      }
      bindEventListener () {
        $('.jingr tbody').on('click', '.dee', this.removeFromCart.bind(this))
        // $(e.target).parents('.item').remove();
        // console.log('11')
        $('.jingr tbody').on('click', '.dels, .add', this.modifyAmount.bind(this))
        $('.jingr tbody').on('blur', '.amount', this.modifyAmount.bind(this))
        $('.jiesh').on('change', this.allEventListener.bind(this))
        $('.jingr tbody').on('change', '.ck', this.notAllEventlistener.bind(this))
        $('.removecheck').on('click', this.removeCheck.bind(this))
      }
      // movek () {
      //   const h = document.documentElement.scrollTop
      //   console.log($('.jiesh').offset().top)
      //   console.log(h);
      // }
    }
    new ShoppingPage
  })
})